<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <select class="province">
        <option value="">请选择省份</option>
        <!-- <option value="A001">北京</option>
        <option value="A002">上海</option>
        <option value="A003">湖北</option>
        <option value="A004">湖南</option> -->
    </select>
    <select class="city" name="" id="">
        <option value="">请选择市/区</option>
        <!-- <option value="A001">朝阳</option>
        <option value="A002">海淀</option>
        <option value="A003">沙河</option>
        <option value="A004">上地</option> -->
    </select>
</body>
<script>
    // 省市二级联动
    // 1. 先请求数据
    // 2. 根据请求的数据动态生成 option 放到select框中
    //    下拉框取值:value   设置select内的结构innerHTML
    // 3. 当省份下拉框切换时 => 对应省份名称或编号 => 找到该省份数据 => 获取对应省份找到城市的集合 =>  动态生成城市的下拉框 (2级)
    // 4. 当城市下拉框切换时 => 对应城市名称或编号 => 找到该城市数据 => 获取对应城市找到市区的集合 =>  动态生成市区的下拉框 (3级)


</script>

</html>